import NProgress from "nprogress";
import "nprogress/nprogress.css";
import router from "@/router";
import { useUserStore } from "@/store/user";

// 配置 NProgress
NProgress.configure({
  easing: "ease", // 动画方式
  speed: 500, // 递增进度条的速度
  showSpinner: false, // 是否显示加载ico
  trickleSpeed: 300, // 自动递增间隔
  minimum: 0.3, // 初始化时的最小百分比
});

// 白名单路由
const whiteList = ["/login", "/404", "/403", "/regin"];

// 路由守卫
router.beforeEach(async (to, from, next) => {
  // 开启进度条
  NProgress.start();

  const userStore = useUserStore();
  const hasToken = localStorage.getItem("token"); // 直接从localStorage获取token

  if (hasToken) {
    if (to.path === "/login") {
      // 已登录时访问登录页，重定向到首页
      next("/");
      NProgress.done();
    } else {
      try {
        // 确保用户信息已加载
        if (!userStore.userInfo.name) {
          await userStore.getUserInfo();
        }
        next();
      } catch (error) {
        // token失效处理
        localStorage.removeItem("token");
        userStore.$reset();
        next(`/login?redirect=${to.path}`);
        NProgress.done();
      }
    }
  } else {
    // 未登录
    if (whiteList.includes(to.path)) {
      // 在免登录白名单，直接进入
      next();
    } else {
      // 其他没有访问权限的页面将被重定向到登录页面
      next(`/login?redirect=${to.path}`);
      NProgress.done();
    }
  }
});

router.afterEach(() => {
  // 结束进度条
  NProgress.done();
});

// 路由错误处理
router.onError((error: Error) => {
  console.error("路由错误:", error);
  NProgress.done();
});

// 自定义进度条样式
const styles = `
  #nprogress .bar {
    background: var(--el-color-primary) !important;
    height: 3px !important;
  }
  
  #nprogress .peg {
    box-shadow: 0 0 10px var(--el-color-primary), 0 0 5px var(--el-color-primary) !important;
  }
`;

// 添加自定义样式到head
const styleElement = document.createElement("style");
styleElement.innerHTML = styles;
document.head.appendChild(styleElement);
